<template>
  <el-container>
    <el-header>
      <searchCOM @search="handleSearch"></searchCOM>
      <DialogOne @update="receive" :tableHeadData="tableHeadData" :tableData="tableData" :dataStandard="dataStandard" :rules="rules"></DialogOne>
    </el-header>
    <tableCOM ref="table" @deleteSelectionA="deleteSelection" @handleSizeChangeA="handleSizeChange" @handleCurrentChangeA="handleCurrentChange"
              @handleSelectionChangeA="handleSelectionChange" @toggleSelectionA="toggleSelection" :tableHeadData="tableHeadData" :tableData="tableData" :operator="operator" :page="page" :pageSize="pageSize" :counts="counts"></tableCOM>
    <editCOM @edit="editConfirm" @dialogEdit="dialogEditClose" :dialogEditVisible="dialogEditVisible" :tableHeadData="tableHeadData"
             :selectList="selectList" :dataUpdate="dataUpdate" :rules="rules"></editCOM>
  </el-container>
</template>

<script>
import DialogOne from "@/components/DialogOne";

import {apiOrgAdd, apiOrgDel, apiOrgList, apiOrgUpdate} from "@/assets/api/OrgAPI";
import searchCOM from "@/components/searchCOM";
import editCOM from "@/components/editCOM";
import tableCOM from "@/components/tableCOM";
export default {
  components: {tableCOM, editCOM, searchCOM, DialogOne},
  data(){
    return{
      tableHeadData: [
        {label: '组织名', width: '', prop: `orgName`},
      ],
      dataStandard :{
        orgName:'',
      },
      rules:{
        orgName: [{required: true, message: '组织名不可为空', trigger: 'blur'},{pattern: /^[A-Za-z0-9\u4e00-\u9fa5]+$/, message: '不允许输入空格等特殊符号'}],
      },
      operator:[
        {'text':'编辑', click: (row, col, cellValue) => {return this.edit(row)}},
        {'text':'删除', click: (row, col, cellValue) => {return this.del(row.id)}},
          ],
      dataUpdate :{},
      pageSize: 10,
      counts:0,
      page:1,
      searchName:'',
      branch:false,
      dialogEditVisible:false,
      multipleSelection:[],
      deleteID:[],
      tableData:[]

    }
  },
  created() {
    this.init()
  },
  methods: {
    parentSubmit(){
      apiOrgAdd(this.dataUpdate)
      this.init()

    },
    receive(var1){
      this.dataUpdate = var1;
      this.parentSubmit()
    },
    async init () {
      const params = {
        page: this.page,
        pageSize: this.pageSize,
        name: this.searchName ? this.searchName : undefined

      }
      apiOrgList(params).then(resp => {
        this.tableData = resp.data.data.records,
            this.counts = resp.data.data.total
      })
    },
    toggleSelection(rows) {
      if (rows) {
        rows.forEach(row => {
          this.$refs.table.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.table.$refs.multipleTable.clearSelection();
      }
    },
    handleSelectionChange(val) {
      let checkArr = []
      val.forEach((n) => {
        checkArr.push(n.id)
      })
      this.multipleSelection = checkArr;
    },
    deleteSelection(){
      this.branch = true
      this.del()
    },
    handleSizeChange(val) {
      this.pageSize = val
      this.init()
    },
    handleCurrentChange(val) {
      this.page = val
      this.init()
    },
    del(rowId){
      this.deleteID = this.branch ? this.multipleSelection : rowId
      if (this.deleteID.length === 0 && this.branch) {
        return this.$message.error('请选择删除对象')
      }
      this.$confirm('确认删除, 是否继续?', '确定删除', {
        'confirmButtonText': '确定',
        'cancelButtonText': '取消',
      }).then(() => {
        console.log(this.branch)
        apiOrgDel(this.branch ? this.deleteID.join(",") : this.deleteID).then(resp =>{
          if (resp.data.code === 1){
            this.$message.success("成功")
          }
        })
        this.branch = false
        this.init()
      })
    },
    edit(row){
      this.dialogEditVisible = true
      this.dataUpdate = JSON.parse(JSON.stringify(row))
    },
    dialogEditClose(){
      this.dialogEditVisible = false
    },
    editConfirm(data){
      apiOrgUpdate(data).then(resp => {
        if(resp.data.code === 1){
          this.$message.success("成功")
        }else {
          this.$message.error(resp.data.msg)
        }
        this.init()
      })
      this.dialogEditVisible = false
    },
    handleSearch(name) {
      this.searchName = name
      this.page = 1;
      this.init();
    },
  },
}
</script>
<style scoped>
</style>